<template>
    <!--
	规格弹窗 说明 此组件为规格展示与交互组件，用于快速下单商品多规格显示，商品详情页面规格显示
      props：
        data      ———— 商品信息
        pageType  ———— 页面类型(quickPlaceOrder,detail)
      method：
        closePopup  ———— 关闭弹窗
        addCart     ———— 加购物车
   -->
    <transition>
        <view class="popup-content paddingBottomBar" v-if="showProductSpec">
            <uni-icons class="icon-close" size="48" type="closeempty" @click="closePopup"></uni-icons>
            <!-- <scroll-view  scroll-y="true"> -->
            <view class="popup-content-main">
                <view class="sku-top">
                    <image v-if="!getAppSet().isHideImg" class="product-img"
                        :src="easyGetImgUrl(changeData.ThumbnailUrl310)" mode="aspectFill"
                        @click="previewImage(changeData)"></image>
                    <view class="product-detail">
                        <view class="product-name text-show-line-1">{{ changeData.ProductName }}</view>
                        <view class="price-box">
                            <text class="price-text">￥</text>
                            <text class="price-text"
                                v-show="changeData.CurrentMinPrice <= changeData.CurrentMaxPrice">{{
                                    changeData.CurrentMinPrice
                                }}</text>
                            <text class="price-text"
                                v-if="!changeData.selected && changeData.ProductAttributesList.length > 1">~{{
                                changeData.CurrentMaxPrice }}</text>
                            <text class="">/</text>
                            <text v-if="changeData.CurrentUnit">{{ changeData.CurrentUnit }}</text>
                        </view>
                        <view class="other">
                            <!-- <text>库存 {{ changeData.V_StockSum }}{{ changeData.DefaultUnit }}</text> -->
                            <text v-show="changeData.MinNum && changeData.MinNum > 0">起批{{ changeData.MinNum
                                }}{{ changeData.DefaultUnit ? changeData.DefaultUnit : changeData.Unit }}</text>
                            <text v-show="LimitBuy && LimitBuy > 0">限购{{ LimitBuy }}{{ changeData.DefaultUnit }}</text>
                        </view>
                    </view>
                </view>

                <view class="sku-unit">
                    <!-- 普通仓启用多仓才展示 -->
                    <view v-if="showWare">
                        <view class="sku-unit-header">
                            <view class="unit-title">
                                <text>发货仓库：</text>
                            </view>
                        </view>
                        <scroll-view scroll-y class="unit-items warehouse-items" enable-flex>
                            <view class="btn btn-gray-fill"
                                :class="{ 'btn-success-fill': activeWareHouseIndex == index }"
                                v-for="(item, index) in wareHouseList" @click="handleWareHouseClick(item, index)"
                                :key="index">
                                {{ item.WarehouseName }}
                            </view>
                        </scroll-view>
                    </view>
                    <!-- <view v-else>
                    <view class="sku-unit-header" v-if="warehouse.WarehouseName">
                        <view class="unit-title">
                            <text>发货仓库：</text>
                        </view>
                    </view>
                    <view class="unit-items" v-if="warehouse.WarehouseName">
                        <view class="btn btn-gray-fill btn-success-fill">
                            {{ warehouse.WarehouseName ? warehouse.WarehouseName : "上海仓储"
                            }}
                        </view>
                    </view>
                </view> -->
                    <view class="sku-unit-header"
                        v-if="changeData.ProductUnitList && changeData.ProductUnitList.length > 1">
                        <view class="unit-title">
                            <text>单位</text><text>：{{ changeData.CurrentUnit }}</text>
                        </view>
                    </view>
                    <view v-if="changeData.ProductUnitList && changeData.ProductUnitList.length > 1" class="unit-items"
                        style="overflow-y: initial;">
                        <view v-for="(item, index) in changeData.ProductUnitList" :key="index" class="btn btn-gray-fill"
                            :class="changeData.UnitActiveIndex == index ? 'btn-success-fill' : ''"
                            v-if="index > customizationShow" @click="changeUnit(index)">
                            {{ item.UnitName }}
                        </view>
                    </view>
                </view>
                <!-- 规格 -->
                <view v-for="(item, index) in changeData.ProductUnitList"
                    v-show="changeData.UnitActiveIndex === index && !isBatch" :key="index">
                    <view v-if="item.ProductSkuAttrList && item.ProductSkuAttrList.length > 0" class="spec-list-tree">
                        <!-- <specTree :data="data"  :min-num="changeData.MinNum" :limit-buy="changeData.LimitBuy"
							:tree-data="item.ProductSkuAttrList" @amountProp="amountProp" :unitActiveIndex="changeData.UnitActiveIndex" :active-index="activeIndex" :active-id="activeId" :addNum="changeData.AddNum"
							@setCarListFunc="setCarListFunc" @treeClickEvent="treeClickEvent" :tempType="tempType" /> -->
                    </view>
                </view>
                <view v-if="data.ProductSkuList && data.ProductSkuList.length > 0" class="spec-list-tree">
                    <specContainer v-if="showSpecContainer" :limit="changeData.LimitBuy" :min="changeData.MinNum"
                        :addNum="changeData.AddNum" :amount="amount" :unitActiveIndex="changeData.UnitActiveIndex"
                        :products="changeData.ProductSkuList" :attrs="changeData.ProductAttributesList"
                        :data="changeData" :addCartShow="addCartShow" :tempType="tempType" :isDirect="isDirect"
                        @handleSelectAttr="handleSelectAttr" @setCarListFunc="setCarListFunc" :key="moduleKey" />
                </view>
            </view>

            <!-- </scroll-view> -->
            <view class="bottom-bar no-shadow" v-if="!isBatch">
                <view class="btn btn-success btn-fill btn-addCart"
                    :class="{ 'btn-ccc': isDirect ? false : !addCartShow }" @click="addCart">
                    加入购物车
                </view>
            </view>
            <num-popup v-if="numPopShow" :amount="batchItem.Amount"></num-popup>
            <privacy-agreement></privacy-agreement>
        </view>
    </transition>
</template>

<script>
import specTree from "@/components/productClass/spec-tree.vue" // 旧规格组件
import specContainer from "@/components/productClass/spec-container.vue" // 新规格组件
import appMixin from "@/utils/appMixin.js"
import { updateCart } from "@/utils/cartUtil.js"
import { upTempCartFn } from "@/utils/tempCartUtil.js"
import { setReduce } from "@/utils/utils.js"
import storage from "@/uni-sub-base/utils/storage.js"
import numPopup from "@/components/order/num-popup.vue"
import privacyAgreement from "@/components/privacy-agreement/privacy-agreement.vue"
import { getAllWareHouseList, GetDirectSaleWarehouseList } from "@/service/api/warehouse.js"
import { getWholeSaleListForSku, getInintProductDetailInfo } from "@/service/api/product.js"
import utilsOld from "@/utils/utilsOld.js"

export default {
    name: "ProductSpec",
    components: {
        specTree,
        numPopup,
        specContainer,
        privacyAgreement,
    },
    props: {
        data: {
            // 数据
            type: Object,
            required: true,
        },
        fresh: {
            type: Boolean,
            required: false,
            default: false,
        },
        pageType: {
            // 按钮类型
            type: String,
            required: false,
            default: "quickPlaceOrder",
        },
        tempType: {
            type: Number,
            default: 0,
        },
        isDirect: {
            type: Boolean,
            default: false,
        },
        isDetail: {
            type: Boolean,
            default: false,
        },
        requestData: {
            type: Object,
            default: () => ({}),
        },
        infoType: {
            type: String,
            default: "",
        },
        wareHouseId: {
            type: String,
            default: "",
        },
    },
    data() {
        return {
            addCartShow: false, // 加入购物车按钮是否置灰
            numPopShow: false,
            changeData: {}, // 总商品数据
            activeUnitIndex: -1, // 单位索引
            activeUnitName: "", // 单位名
            activeUnitRatio: 1,
            activeSpecIndex: -1,
            secondSpecList: [],
            cartRequestObj: [], // 购物车
            ProductSkuAttrList: [],
            V_GradePrice: "", // 价格
            LimitBuy: 0, // 限购
            // guige
            activeIndex: -1, //当前选中规格
            activeId: 0, //当前选中规格Id
            classifyList: [],
            //是否是单规格
            isSingle: false,
            // 批量加购
            isBatch: false,
            ProductAttributesList: [], // 商品规格数组
            batchData: [], // 商品规格数量
            batchInfo: [], // 商品单位
            cartBatchRequestList: [],
            allSkuModel: [],
            customizationShow: -1, // 是否显示单位  多单位默认选第二,单个选第一
            amount: 0,
            warehouse: {},
            wareHouseList: [],
            activeWareHouseIndex: -1,
            showSpecContainer: true,
            webInfo: null,
            showProductSpec: true,
            moduleKey: 0
        }
    },
    computed: {
        showWare() {
            return this.isDirect || (!this.isDirect && this.webInfo.IsSelectWarehouse == 1)
        },
    },
    watch: {
        data(newVal, oldVal) {
            this.init()
        },
        fresh(newVal, oldVal) {
            this.init()
        },
        cartRequestList(newVal, oldVal) {
            this.cartRequestList = newVal
        },
    },
    created() {
        this.init()
        this.getWareHouseList()
    },
    methods: {
        // 初始化数据
        init() {
            const _this = this
            this.activeUnitIndex = -1 // 计量单位索引
            this.activeUnitName = "" //  计量单位名
            this.activeUnitRatio = 1
            this.activeSpecIndex = -1
            this.secondSpecList = []

            this.batchData = []
            this.changeData = Object.assign({}, this.data)// 商品总数据
            console.log(this.data)
            // 商品规格
            if (this.data.ProductAttributesList) {
                this.ProductAttributesList = JSON.parse(JSON.stringify(this.data.ProductAttributesList)) // 商品规格数组
                this.batchData.length = this.ProductAttributesList.length // 商品规格数量
            }
            //获取所有规格
            // 初始化批量加购设置
            this.isBatch = false
            this.batchInfo = [] // 商品多单位
            if (this.changeData.ProductUnitList && this.changeData.ProductUnitList.length > 0) {
                this.changeData.ProductUnitList.forEach((item) => {
                    if (item.ProductSkuAttrList && item.ProductSkuAttrList.length > 0) {
                        let betchOjb = {
                            Amount: 0,
                            UnitId: item.UnitId,
                            UnitName: item.UnitName,
                            selectItems: [],
                        }
                        _this.initLoopArr(item.ProductSkuAttrList, betchOjb, 0, item)
                        this.batchInfo.push(betchOjb)
                        //去重 去掉相同级别的选项
                        this.batchInfo.forEach((e) => {
                            e.selectItems = setReduce(e.selectItems, "lv")
                        })
                    }
                })
            }

            // 单位默认
            if (this.changeData.ProductUnitList && this.changeData.ProductUnitList.length > 1) {
                this.changeData.ProductUnitList.forEach((item, index) => {
                    if (item.IsCustomized) {
                        this.customizationShow = 0
                        this.changeUnit(1) //默认选第二个
                    } else {
                        this.changeUnit(0) //默认选第二个
                    }
                })
            } else {
                this.changeUnit(0) //默认选第一个
            }
            this.warehouse = storage.getCache("warehouse")
            this.webInfo = storage.getCache("webInfo")
            // this.showProductSpec = false;
            this.$nextTick(() => {
                this.showProductSpec = true;
            })
        },
        getWareHouseList() {
            if (this.isDirect) {
                // 直发仓库
                GetDirectSaleWarehouseList().then((res) => {
                    if (res.State == 1) {
                        this.wareHouseList = res.Data.reverse()
                        const index = this.wareHouseList.findIndex((item) => item.WarehouseId == this.wareHouseId)
                        if (index != -1) {
                            this.activeWareHouseIndex = index
                            storage.setCache("directWareHouse", this.wareHouseList[index])
                        }
                    }
                })
            } else {
                // 普通多仓
                getAllWareHouseList().then((res) => {
                    if (res.State == 1) {
                        this.wareHouseList = res.Data.reverse()
                        const index = this.wareHouseList.findIndex(
                            (item) => item.WarehouseId == storage.getCache("warehouse").WarehouseId,
                        )
                        if (index != -1) {
                            this.activeWareHouseIndex = index
                            storage.setCache("warehouse", this.wareHouseList[index])
                            this.handleWareHouseClick(this.wareHouseList[index], index)
                        }
                    }
                })
            }
        },
        handleWareHouseClick(item, index) {
            if (this.isDetail) {
                // 详情的切换仓库
                let webInfo = storage.getCache("webInfo")
                this.$emit("changeProductData", {
                    WarehouseId: item.WarehouseId,
                    activeWareHouseIndex: index,
                    IsSelectWarehouse: webInfo.IsSelectWarehouse,
                })
            } else {
                // 列表的切换仓库
                getWholeSaleListForSku({
                    ...this.requestData,
                    ProductIds: this.data.ID,
                    warehouseId: item.WarehouseId,
                }).then((res) => {
                    if (res.State == 1) {
                        if (res.Data.Data[0]) {
                            this.changeArr(res.Data.Data, true)
                            this.$emit("changeProductData", res.Data.Data[0])
                            // this.showProductSpec = false
                            // this.$nextTick(() => {
                            //     this.showProductSpec = true
                            // })
                            this.activeWareHouseIndex = index
                            if (this.isDirect) {
                                storage.setCache("directWareHouse", item)
                            } else {
                                storage.setCache("warehouse", item)
                            }
                        } else {
                            this.easyToast(item.WarehouseName + "没有可购买的直发商品")
                        }
                    }
                })
            }
        },
        setWareHoseActive(index) {
            this.activeWareHouseIndex = index
            const item = this.wareHouseList[index]
            if (this.isDirect) {
                storage.setCache("directWareHouse", item)
            } else {
                storage.setCache("warehouse", item)
            }
        },
        // 整理数据
        changeArr(Arr, isNew) {
            const _this = this
            Arr.forEach((item) => {
                // 图片列表
                if (item.ImageUrl) {
                    const ImgUrlList = utilsOld.strToArr(item.ImageUrl)
                    item.logo = ImgUrlList[0]
                }
                if (item.ThumbnailUrl160) {
                    item.logo = item.ThumbnailUrl160
                }

                // 设置显示的动态值
                item.CurrentMaxPrice =
                    item.SaleMaxPrice % 1 === 0
                        ? item.SaleMaxPrice
                        : Number(item.SaleMaxPrice.toFixed(this.priceDecimalPlaces)) // 显示最高价格
                item.CurrentMinPrice =
                    item.SaleMinPrice % 1 === 0
                        ? item.SaleMinPrice
                        : Number(item.SaleMinPrice.toFixed(this.priceDecimalPlaces)) // 显示最低价格
                item.CurrentUnit = item.ProductUnitList[0].UnitName // 显示当前单位
                item.CurrentUnitId = item.ProductUnitList[0].UnitId // 显示当前单位ID
                item.CurrentStock = item.V_StockSum // 显示当前库存
                item.UnitActiveIndex = 0 // 单规格商品默认显示第一个加减框

                // 单位栏添加
                if (item.ProductUnitList.length > 0) {
                    item.ProductUnitList.forEach((ite) => {
                        ite.Title = ite.UnitName + (ite.Ratio !== 1 ? "=" + ite.Ratio + item.DefaultUnit : "")
                        this.initLoopArr2(ite.ProductSkuAttrList)
                    })
                }

                // ProductSkuList数据修改
                item.ProductSkuList.forEach((ite) => {
                    if (ite.ProductUnitPriceList[0]) {
                        ite.CurrentPrice =
                            ite.ProductUnitPriceList[0].Price % 1 === 0
                                ? ite.ProductUnitPriceList[0].Price
                                : Number(ite.ProductUnitPriceList[0].Price.toFixed(this.priceDecimalPlaces))
                        ite.CurrentUnit = ite.ProductUnitPriceList[0].UnitName // 显示当前单位
                        ite.CurrentUnitId = ite.ProductUnitPriceList[0].UnitId // 显示当前单位ID
                        ite.UnitActiveIndex = 0 // 单规格商品默认显示第一个加减框
                        ite.ProductUnitPriceList.forEach((it) => {
                            it.Amount = 0
                            it.Title = it.UnitName + (it.Ratio !== 1 ? "=" + it.Ratio + ite.DefaultUnit : "")
                        })
                    }
                })
                if (isNew) {
                    // _this.productList.push(item)
                }
            })
        },
        // 遍历规格，数量清零
        initLoopArr2(arr) {
            if (arr && arr.length > 0) {
                for (let i = 0; i < arr.length; i++) {
                    if (arr[i].ProductAttrList && arr[i].ProductAttrList.length > 0) {
                        this.initLoopArr2(arr[i].ProductAttrList)
                    } else {
                        if (arr[i].SkuModel && arr[i].SkuModel.ProductUnitPrice) {
                            arr[i].SkuModel.ProductUnitPrice.Amount = 0
                        }
                    }
                }
            }
        },
        // 遍历规格添加数据
        initLoopArr(arr, betchOjb = null, lv = 0, item) {
            if (arr && arr.length > 0) {
                let obj = {
                    lv,
                    AttributeName: arr[0].AttributeName,
                    items: [],
                }
                lv = lv + 1
                for (let i = 0; i < arr.length; i++) {
                    if (arr[i].ProductAttrList && arr[i].ProductAttrList.length > 0) {
                        //有子项
                        if (betchOjb) {
                            // arr[i].Selected = false
                            obj.items.push(arr[i])
                            this.initLoopArr(arr[i].ProductAttrList, betchOjb, lv)
                        } else {
                            this.initLoopArr(arr[i].ProductAttrList)
                        }
                    } else {
                        //没有子项
                        if (arr[i].SkuModel && arr[i].SkuModel.ProductUnitPrice) {
                            const _SkuModel = arr[i].SkuModel
                            const _ProductUnitPrice = arr[i].SkuModel.ProductUnitPrice
                            arr[i].Stock = _SkuModel.Stock
                            arr[i].AddNum = _SkuModel.AddNum
                            arr[i].ProductId = _ProductUnitPrice.ProductId
                            // arr[i].Amount = _ProductUnitPrice.Amount || 0
                            if (_SkuModel.Stock == 0) {
                                arr[i].Amount = 0
                            } else {
                                if (item && item.Ratio && item.Ratio == 1) {
                                    arr[i].Amount =
                                        arr[i].SkuModel.MinimumOrder > 0
                                            ? arr[i].SkuModel.MinimumOrder
                                            : this.changeData.MinNum || 1
                                } else {
                                    arr[i].Amount = 1
                                }
                            }
                            arr[i].Ratio = _ProductUnitPrice.Ratio
                            arr[i].SkuId = _ProductUnitPrice.SkuId
                            arr[i].UnitId = _ProductUnitPrice.UnitId
                            arr[i].UnitName = _ProductUnitPrice.UnitName
                            arr[i].V_AttributeNameValue = _SkuModel.AttributeNameValue
                            arr[i].V_FactPrice = _SkuModel.ProductUnitPrice.Price
                            arr[i].Selected = false
                            arr[i].Remark = _SkuModel.Remark
                            if (betchOjb) {
                                obj.items.push(arr[i])
                                this.allSkuModel.push(arr[i])
                            }
                        }
                    }
                }
                betchOjb.selectItems.unshift(obj)
            }
        },
        // 关闭弹窗
        closePopup() {
            this.changeData.selected = false
            this.$emit("closePopup")
        },
        // 加入购物车
        addCart() {
            if (this.isDirect) {
                this.addCartShow = true
                if (this.activeWareHouseIndex == -1) {
                    this.easyToast("请选择发货仓库！")
                    return
                }
            } else {
                if (this.webInfo.IsSelectWarehouse == 1 && this.activeWareHouseIndex == -1) {
                    this.easyToast("请选择发货仓库！")
                    return
                }
            }
            if (this.addCartShow) {
                if (this.cartRequestList && this.cartRequestList.length > 0) {
                    if (this.tempType == 0) {
                        if (
                            this.cartRequestList[0].ProductAttrList &&
                            this.cartRequestList[0].ProductAttrList.length > 0
                        ) {
                            let addCart = []
                            this.cartRequestList[0].ProductAttrList.forEach((item) => {
                                if (item.Selected) {
                                    addCart.push(item)
                                }
                            })
                            if (addCart.length == 0) {
                                addCart.push(this.cartRequestList[0].ProductAttrList[0])
                            }
                            if (addCart[0].IsLock) {
                                this.easyToast("禁用商品无法购买")
                                return
                            }
                            if (addCart[0].Amount > 0) {
                                updateCart(addCart, false, true, this.isDirect ? 24 : undefined).then((res) => {
                                    this.easyToast("加入购物车成功")
                                })
                            }
                        } else {
                            if (this.cartRequestList[0].IsLock) {
                                this.easyToast("禁用商品无法购买")
                                return
                            }
                            if (this.cartRequestList[0].Amount > 0) {
                                updateCart(this.cartRequestList, false, true, this.isDirect ? 24 : undefined).then(
                                    (res) => {
                                        this.easyToast("加入购物车成功")
                                    },
                                )
                            }
                        }
                    } else {
                        this.$emit("addCart", this.cartRequestList)
                    }
                }
            }
        },
        //切换单位
        changeUnit(index) {
            this.changeData.UnitActiveIndex = index
            this.changeData.CurrentUnit = this.changeData.ProductUnitList[index].UnitName
            if (this.changeData.ProductUnitList[index].IsCustomized) {
                if (this.changeData.ProductUnitList[0]) {
                    this.changeData.CurrentUnit = this.changeData.ProductUnitList[0].UnitName
                }
            }
            this.changeData.CurrentUnitId = this.changeData.ProductUnitList[index].UnitId
            let min = 0
            let max = 0
            // 最大最小价格
            this.changeData.ProductUnitList[index].SkuUnitPriceList.forEach((e, index) => {
                let price = e.Price
                if (index == 0) {
                    min = price
                    max = price
                } else {
                    if (price < min) {
                        min = price
                    }
                    if (price > max) {
                        max = price
                    }
                }
            })
            this.changeData.CurrentMinPrice = min
            this.changeData.CurrentMaxPrice = max
            let Selectednum = 0
            this.changeData.ProductUnitList[index].ProductSkuAttrList.forEach((e, index) => {
                if (e.Selected) {
                    Selectednum++
                    this.changeData.CurrentMinPrice = e.SkuModel.ProductUnitPrice.Price
                    this.changeData.ThumbnailUrl310 = e.SkuModel.SkuImg
                }
            })
            if (Selectednum == 0) {
                let skuleng = this.changeData.ProductUnitList[index].ProductSkuAttrList.length
                if (this.changeData.ProductUnitList[index].ProductSkuAttrList[0].SkuModel) {
                    this.changeData.CurrentMinPrice =
                        this.changeData.ProductUnitList[index].ProductSkuAttrList[0].SkuModel.ProductUnitPrice.Price
                    this.changeData.ThumbnailUrl310 =
                        this.changeData.ProductUnitList[index].ProductSkuAttrList[0].SkuModel.SkuImg
                } else {
                    // this.changeData.CurrentMinPrice =
                    //     this.changeData.ProductUnitList[
                    //         index
                    //     ].ProductSkuAttrList[0].ProductAttrList[0].SkuModel.ProductUnitPrice.Price
                    // this.changeData.ThumbnailUrl310 =
                    //     this.changeData.ProductUnitList[index].ProductSkuAttrList[0].ProductAttrList[0].SkuModel.SkuImg
                }
            }
            this.$forceUpdate()
            this.$emit("changeUnit", this.changeData)
            // this.showSpecContainer = false
            this.$nextTick(() => {
                this.showSpecContainer = true
                this.moduleKey++;
                this.$forceUpdate()
            })
        },
        // 选择属性
        handleSelectAttr(data, selectedProduct, addCartShow) {
            this.changeData = data
            this.addCartShow = addCartShow
            this.$forceUpdate()
        },
        // 加入购物车数据
        setCarListFunc(obj) {
            // 商品购物车
            let _newObj = true
            this.cartRequestList = []
            if (this.cartRequestList && this.cartRequestList.length > 0) {
                for (let i = 0; i < this.cartRequestList.length; i++) {
                    if (
                        obj.UnitId === this.cartRequestList[i].UnitId &&
                        obj.SkuId === this.cartRequestList[i].SkuId &&
                        obj.ProductId === this.cartRequestList[i].ProductId
                    ) {
                        this.cartRequestList[i].Amount = obj.Amount
                        _newObj = false
                        break
                    }
                }
            }
            if (_newObj) {
                this.cartRequestList.push(obj)
            }
            this.$forceUpdate()
        },
        // 预览商品图
        previewImage(data) {
            let that = this
            let imgUrls = []
            imgUrls.push(this.easyGetImgUrl(data.ThumbnailUrl310))
            uni.previewImage({
                current: 0,
                urls: imgUrls,
                longPressActions: {
                    itemList: ["保存图片"],
                    success: function (ress) {
                        uni.downloadFile({
                            url: item,
                            success: (res) => {
                                if (res.statusCode === 200) {
                                    uni.saveImageToPhotosAlbum({
                                        filePath: res.tempFilePath,
                                        success: function () {
                                            //uniapp提供的消息提示框。
                                            uni.showToast({
                                                title: "保存成功",
                                                icon: "success",
                                            })
                                        },
                                        fail: function () {
                                            uni.showToast({
                                                title: "保存失败，请稍后重试",
                                                icon: "none",
                                            })
                                        },
                                    })
                                }
                            },
                        })
                    },
                    fail: function (res) {
                        console.log(res.errMsg)
                    },
                },
            })
        },
    },
}
</script>

<style lang="scss" scoped>
.icon-close {
    position: fixed;
    top: $app-page-padding/2;
    right: $app-page-padding/2;
    z-index: 1;
}

.spec-list-tree {
    padding: 0 $app-page-padding;
}

// 弹窗组件
.popup-content {
    display: flex;
    position: relative;
    background: $color-white;
    border-radius: 40rpx 40rpx 0 0;
    padding-top: 20rpx;
    max-height: 86vh;
    z-index: 0;

    .sku-top {
        display: flex;
        flex-direction: row;
        padding: $app-page-padding;

        .product-img {
            width: 200rpx;
            height: 200rpx;
            margin-right: 20rpx;
            border-radius: 8rpx;
        }

        .product-detail {
            display: flex;
            flex: 1;
            flex-direction: column;

            .price-box {
                display: flex;
                flex: 1;
                align-items: center;
            }

            .other {
                display: flex;
                flex-direction: column;

                text {
                    margin-top: 20rpx;
                }
            }

            .price-text {
                font-size: $font-size-36;
                color: $color-orange-1;
                font-weight: 600;
            }
        }
    }

    .sku-unit {
        padding: 0 $app-page-padding;

        .sku-unit-header {
            display: flex;
            flex-direction: row;

            .unit-title {
                flex: 1;
                line-height: 1;

                text {
                    color: #666666;
                }
            }

            .batch-check-box {
                display: flex;
                flex-direction: row;
                align-items: center;

                .batch-text {
                    margin-right: 10rpx;
                }

                .select-box {
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    width: 24rpx;
                    height: 24rpx;
                    border: solid 1rpx $app-color-text-tip;
                    border-radius: 4rpx;
                }

                .selected {
                    border-color: $color-yellow-4;
                }
            }
        }

        .unit-items {
            display: flex;
            flex-direction: row;
            flex-wrap: wrap;
            max-height: 200rpx;
            overflow-y: auto;
            margin: 16rpx 0 22rpx;

            .btn {
                min-width: 60rpx;
                border-radius: $border-radius-4;
                margin-right: 20rpx;
                margin-bottom: 10rpx;
                line-height: 56rpx;
                height: 56rpx;
            }
        }
    }

    .bottom-bar {
        margin-top: -20rpx;

        .btn {
            text-align: center;
            line-height: 86rpx;
            height: 86rpx;
            font-size: 32rpx;

            &:first-child {
                margin-left: 0;
            }
        }

        .btn-batch {
            flex: 1;
            border: solid 1rpx $color-black-1;
        }

        .btn-addCart {
            flex: 3;
        }
    }
}

.batch-num-box {
    display: flex;
    flex-direction: row;
    border-top: solid 1rpx $app-color-input-bg;
    padding-top: $app-page-padding;

    .num-title {
        display: flex;
        flex: 1;
    }

    .num-btn {
        display: flex;
        justify-content: center;
        align-items: center;

        &:after {
            border: 0 !important;
        }
    }
}

.product-name {
    font-size: 32rpx;
    color: $color-gray-1;
    font-weight: bold;
}

.popup-content-main {
    width: 100%;
}

.btn-ccc {
    color: #ccc;
    background: #f5f5f5;
    border-color: #ccc;
}

/deep/.warehouse-items .uni-scroll-view-content {
    display: flex;
}
</style>
